html,body{height:100%; font-size:16px;}
body {position:relative;margin:0; padding:0; background:#fff; font-family:Helvetica, Arial, sans-serif;}
#side{position:fixed; left:0; width:585px; height:100%;background:#fff;z-index:2;border-right: 4px solid #237DAC;
-webkit-box-shadow: 20px 0px 20px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    20px 0px 20px rgba(50, 50, 50, 0.75);
box-shadow:         20px 0px 20px rgba(50, 50, 50, 0.75);
}
/* custom fonts */
@font-face {
	font-family: 'eurof55-webfont';
	src: url('fonts/eurof55-webfont.eot');
	src: local('O'), url('fonts/eurof55-webfont.woff') format('woff'), url('fonts/eurof55-webfont.ttf') format('truetype'), url('fonts/eurof55-webfont.svg#webfont8xigBfG2') format('svg');
}
@font-face {
	font-family: 'eurof35-webfont';
	src: url('fonts/eurof35-webfont.eot');
	src: local('O'), url('fonts/eurof35-webfont.woff') format('woff'), url('fonts/eurof35-webfont.ttf') format('truetype'), url('fonts/eurof35-webfont.svg#webfont8xigBfG2') format('svg');
}
@font-face {
	font-family: 'graublauweb-webfont';
	src: url('fonts/graublauweb-webfont.eot');
	src: local('O'), url('fonts/graublauweb-webfont.woff') format('woff'), url('fonts/graublauweb-webfont.ttf') format('truetype'), url('fonts/graublauweb-webfont.svg#webfont8xigBfG2') format('svg');
}
.clear{clear:both;}
a:link,a:visited,a:hover{color:#ddd;}
a:hover{color:#fff; text-decoration:none;}
#bg{position:fixed; left:585px; top:0; width:100%; height:100%;background:#333 url(sw_page_bg.png);}
#bgimg{display:none; cursor:pointer; -ms-interpolation-mode: bicubic;} /* special IE fix for resized images */
#preloader{position:absolute; z-index:2; width:140px; padding:20px; top:20px; left:50px; background:#000; color:#666; font-family:graublauweb-webfont, Helvetica, Arial, sans-serif; font-size:16px; -moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;}
#preloader img{margin-right:20px;}
#toolbar{position:absolute;bottom:0;left:44%;z-index:1000;display:none; padding:15px 15px;  background:#0E77B8;font-family:graublauweb-webfont, Helvetica, Arial, sans-serif; font-size:16px; color:#fff; cursor:pointer;}
#outer_container{position:relative; margin:0; width:585px; height:100%; padding:0; z-index:2;} /* fucking IE needs a background value to understand hover area */
/* #customScrollBox{position:relative; background:url(/od/sw_l_bg.png) repeat-y;} */
#customScrollBox{position:relative;}
#customScrollBox .container{position:relative; width:585px;  top:0; float:left; }
#customScrollBox .content{clear:both; background:#fff;border-left: 1px solid #237DAC;}
#customScrollBox .content h1{padding:20px; margin:0; color:#fff; font-family:eurof55-webfont, Helvetica, Arial, sans-serif; 
font-size:48px;text-shadow: 0px 0px 2px #000;}

#customScrollBox .content h2{padding:5px; margin:10px 10px 0 10px; color:#fff; font-family:eurof35-webfont, Helvetica, Arial, sans-serif; font-size:24px;}
#customScrollBox .content p{padding:5px; margin:0 10px 10px 10px; color:#111; font-family:graublauweb-webfont, Helvetica, Arial, sans-serif; line-height:26px; text-shadow: 0px 0px 1px #999;}
/* .light{font-family:eurof35-webfont, Helvetica, Arial, sans-serif;} */
.light{font-family: 'Open Sans Condensed', sans-serif;}
.grey{color:#999;}
.lightgrey{color:#ddd;}
.s36{font-size:36px;}
.s24{font-size:24px;}
#customScrollBox a.thumb_link{position:relative;  display:block; float:left;}
#customScrollBox img.thumb{vertical-align:bottom;border:none; width:292px; height:170px; }
#customScrollBox a.thumb_link .selected{position:absolute; top:0; left:0; width:292px; height:170px; 
background:url(/od/selected.png) no-repeat; display:none;}

#customScrollBox a.thumb_link > .shadow{position:absolute; top:0; left:0; width:292px; height:170px; 
background:url(/od/border.png) no-repeat; display:block;}

#customScrollBox a.thumb_link > .shadow:hover{position:absolute; top:0; left:0; width:292px; height:170px; 
background:url(/od/clear_zoom.png) no-repeat; display:block;}

#nextimage_tip{position:fixed; z-index:1; padding:0 20px; line-height:40px; color:#fff; height:40px; top:50%; margin-top:-20px; right:20px; background:url(/od/sw_transparent_black_bg.png); -moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; display:none; font-family:graublauweb-webfont, Helvetica, Arial, sans-serif;}
.with_border{border:1px solid #000;}
.with_shadow{-moz-box-shadow:0 0 40px #000; -webkit-box-shadow:0 0 40px #000; box-shadow:0 0 40px #000;}

li {color:#fff;}
/* #bg_logo{position:fixed; left:585px; top:0; width:100%;} */
#bg_logo{ width:100%;}
#bg_logo_cont{position:fixed; left:585px; top:0; width:100%;}
#logood_main{position:absolute; left:100px; top:100px; }

#bg_text{position:absolute; top:0; left:100px; width:400px;z-index:2; }
#text{overflow:auto;   background:#fff;  display:none; padding:80px 0px 0px 0px; border:1px solid #ddd;} 
#text p{ margin:0; padding:0px 20px 10px 20px; color:#000; text-shadow: 0px 0px 1px #999;
font-family:graublauweb-webfont, Helvetica, Arial, sans-serif; line-height:26px;}
.text{display:none; color:#fff; font-size:1em;}
#text p.str {padding-top:5px;border-top:1px solid #ddd;text-align: center;} 





#bottom{position:fixed; top:90%; left:25px; padding:20px; margin:0;  font-size:48px; background:#0E77B8;}
#top_menu{display: block;background:#0E77B8;

-webkit-box-shadow: 0px 5px 5px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0px 5px 5px rgba(50, 50, 50, 0.75);
box-shadow:         0px 5px 5px rgba(50, 50, 50, 0.75);

}

#top_menu_1px{display: block;border-bottom: 1px solid #46A4DA;
}

#top_menu_2px{display: block;border-bottom: 2px solid #3696D2;}
#top_menu_4px{display: block;border-bottom: 4px solid #0E77B8;}
#bot_menu{text-shadow: 0px 0px 2px #000;
-webkit-box-shadow: 0px -2px 2px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0px -2px 2px rgba(50, 50, 50, 0.75);
box-shadow:         0px -2px 2px rgba(50, 50, 50, 0.75);



display: block;position: fixed;z-index: 1000;bottom: 0px;width: 545px;background: #0E77B8;color:#fff; font-family:eurof55-webfont, Helvetica, Arial, sans-serif;font-size:48px;text-align: center;padding:10px 20px 10px 20px;margin:0;text-decoration:none;}
.push{height:50px;}
#to_menu{position:absolute;z-index: 1000;width:100%; text-align:center; cursor:pointer; width:100%; top:0; display:none;  margin:0; color:#fff; padding-top:10px;padding-bottom:10px;font-family:eurof55-webfont, Helvetica, Arial, sans-serif; font-size:48px; background:#0E77B8;}
#back{width:80px; height:100%;position:absolute;bottom: 0px;left:0;top:0;text-align:center;display:none;background:#000;color:#fff;cursor:pointer;z-index:10;padding:0 10px 0 10px; font-family:eurof55-webfont, Helvetica, Arial, sans-serif; font-size:48px;}
#next{width:80px; height:100%;position:absolute;bottom: 0px;right:0;top:0;text-align:center;display:none;background:#000;color:#fff;cursor:pointer;z-index:10;padding:0 10px 0 10px; font-family:eurof55-webfont, Helvetica, Arial, sans-serif; font-size:48px;}
.rel {position:relative;width:100%; height:100%;}
.str_back {position:absolute;top:45%;width:70px; height:50px;background:url(/od/str_back.png)}
.str_next {position:absolute;top:45%;width:70px; height:50px;background:url(/od/str_next.png)}



#mon {position:relative;}
#monitor1, #monitor2, #monitor3, #monitor4, #monitor5, #monitor6 {position:fixed; background:#0E99ff;width:auto;height:40px;z-index:10; color:fff;font-size:26px;padding:10px;}
#monitor1 {left:0;top:0;}
#monitor2 {left:0;top:180px;}
#monitor5 {left:0;top:60px;}
#monitor6 {left:0;top:120px;}
#monitor3 {left:500px;top:0;}
#monitor4 {left:500px;top:100px;}

.article p{font-size:20px;}

#bgimg_sw{position:absolute; top:0; left:0; width:100%; height:100%; display:none;z-index:1;
-moz-box-shadow: inset 0 0 60px 5px #000;
-webkit-box-shadow: inset 0 0 60px 5px #000;
box-shadow: inset 0 0 60px 5px #000;
cursor:pointer;
}

#bgimg_sw_start{position:absolute; top:0; left:0; width:100%; height:100%; display:block;z-index:1;
-moz-box-shadow: inset 0 0 60px 5px #000;
-webkit-box-shadow: inset 0 0 60px 5px #000;
box-shadow: inset 0 0 60px 5px #000;
}

#img_thumbs {position:relative;display:block;width:585px; }
#help {position:absolute; left:10px; width:292px; height:120px;background:url(/od/help.png) no-repeat;color:#ff0000;display:none;z-index:1;font-family:eurof55-webfont, Helvetica, Arial, sans-serif; font-size:28px;}
#help div {padding:30px 40px 20px 100px;}
#logo_tatcenter {position:absolute;top:10px; left:74%; background:url(/od/logo_tatcenter.png) no-repeat;z-index:100;display:block;width:300px; height:45px;}






